<template>
  <el-table :data="auditData" border stripe>
    <!-- 基本信息 -->
    <el-table-column type="index"></el-table-column>
    <el-table-column label="商品图片">
      <template slot-scope="scope">
        <el-image :src="scope.row['productCover']"
                  :preview-src-list="[scope.row['productCover']]"
                  class="goods_image"></el-image>
      </template>
    </el-table-column>
    <el-table-column prop="productSpecies" label="商品名"></el-table-column>
    <el-table-column prop="productVariety" label="商品种类"></el-table-column>
    <el-table-column prop="applyTimes" label="提交次数"></el-table-column>
    <el-table-column prop="createTime" label="提交时间"></el-table-column>

    <!-- 操作 -->
    <el-table-column label="操作" width="180px" class="btns">
      <template slot-scope="scope">
        <auditHandle v-if="auditType===-1" :goods-info="scope.row" @changeType="changeType"></auditHandle>
        <auditRemove></auditRemove>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>

import {getAuditList} from '@/network/goods'
import Pagination from '@/components/common/Pagination'
import auditHandle from '@/components/goods/auditChildComponents/auditHandle'
import auditRemove from '@/components/goods/auditChildComponents/auditRemove'
import pagingMixin from '@/mixins/paging'
export default {
  name: "auditTable",
  components:{Pagination,auditHandle,auditRemove},
  data() {
    return {
      auditData: []
    }
  },
  mixins: [pagingMixin],
  props: {
    auditType: String | Number,
    queryInfo: {
      type: Object,
      default() {
        return {
          pageNum: 1, // 当前页
          pageSize: 5 // 每页显示多少条数据
        }
      }
    }
  },
  methods: {
    changeType(id){
      const index = this.auditData.findIndex(item => item.id === id)
      this.auditData.splice(index,1)
    },
    async getData() {
      const {pageNum, pageSize} = this.queryInfo
      const {auditType} = this
      const {data: {list, total}} = await getAuditList(auditType, pageNum, pageSize)
      this.auditData = list
      this.$emit("total", total)
    }
  },
  watch:{
    auditType(){
      this.getData()
    }
  },
  mounted() {
    this.getData()
  }
}
</script>

<style scoped>
.goods_image {
  width: 80px;
  aspect-ratio: 1;
}
</style>
